<?php
	$template['title']='悠游网首页';
	include 'inc/header_inc.php';
?>

		<!-- 当前位置 -->
		<div class="loaction">
			<ol class="breadcrumb">
				<li><img src="img/location.gif" />当前位置:</li>
				<li><a href="index.php"> 首页 </a></li>
				<div class="search">
					<form action="" method="post">
						<input type="text" placeholder="请输入关键字查询.." name="search" class="form-control" />
						<input type="submit" class="btn btn-primary" value="搜索" />
					</form>
				</div>
			</ol>
		</div>

			<!-- 季节分类 -->
			<div id="weather">
				<div class="title2">
					<ul>
						<li><img src="img/index/content_title04.gif" alt="" /></li>
					</ul>
				</div>
				<div class="weth_nav">
					<!-- 文本 -->
					<div class="txt">
						<span class='active'>1月</span><span>2月</span>
						<span>3月</span><span>4月</span>
						<span>5月</span><span>6月</span>
						<span>7月</span><span>8月</span>
						<span>9月</span><span>10月</span>
						<span>11月</span><span>12月</span>
					</div>

					<!-- 流程线以及1月-12月小图标 -->
					<div class="wire"></div>
					<div class="dot">
						<a href="javascript:;" class="active"></a>
						<a href="javascript:;"></a>
						<a href="javascript:;"></a>
						<a href="javascript:;"></a>
						<a href="javascript:;"></a>
						<a href="javascript:;"></a>
						<a href="javascript:;"></a>
						<a href="javascript:;"></a>
						<a href="javascript:;"></a>
						<a href="javascript:;"></a>
						<a href="javascript:;"></a>
						<a href="javascript:;"></a>
					</div>
					<!-- 天气图图标 -->
					<div class="iocos">
						<img class="iocos_1" src="img/index/weather/season-c.png" alt="" />
						<img class="iocos_2" src="img/index/weather/season-x.png" alt="" />
						<img class="iocos_3" src="img/index/weather/season-q.png" alt="" />
						<img class="iocos_4" src="img/index/weather/season-dd.png" alt="" />
					</div>
				</div>

				<div id="pic">
					<p style="text-align:center; font-size:18px;" class="tip"><span>内容正在加载中...</span><img src="img/loading.gif" style="width:80px;" /></p>
				</div>
			</div>

			<!-- 主体部分 -->
			<div id="main">
				<div id="scenery">
					<div class="tour" id="tour">

						<!-- 旅游精选 -->
						<div class="tourism">
							<div class="title2">
								<ul>
									<li><img src="img/index/content_title.gif" alt="" /></li>
									<a href="TravelWord.php">更多 >></a>
								</ul>
							</div>
							<!-- 轮播图 -->
							<div class="content move" style="display: block;">
								<div class="silde">旅<br />游<br />精<br />选</div>
								<ul>
								<p style="text-align:center; font-size:18px;" class="tip"><span>内容正在加载中...</span><img src="img/loading.gif" style="width:80px;" /></p>
								</ul>
							</div>
						</div>

						<!-- 风景名胜 -->
						<div class="tourism tourism2">
							<div class="title2">
								<ul>
									<li><img src="img/index/content_title02.gif" alt="" /></li>
									<a href="famousScenery.php">更多 >></a>
								</ul>
							</div>

							<!-- 轮播图 -->
							<div class="content move" style="display: block;">
								<div class="silde">风<br />景<br />名<br />胜</div>
								<ul>
								<p style="text-align:center; font-size:18px;" class="tip"><span>内容正在加载中...</span><img src="img/loading.gif" style="width:80px;" /></p>
								</ul>
							</div>
						</div>

						<!--热门景点-->
						<div class="title2 hot_title">
							<ul>
								<li><img src="img/index/content_title03.gif"/></li>
								<a href="hotSpots.php">更多 >></a>
							</ul>
						</div>
						<div class="hot">
							<div class="content5">
								<ul id="ul1">
									<p style="text-align:center; font-size:18px;" class="tip"><span>内容正在加载中...</span><img src="img/loading.gif" style="width:80px;" /></p>
								</ul>
							</div>
						</div>

					</div>

					<!-- 旅游信息类 -->
					<div class="infos">

						<!-- 景点资讯 -->
						<div class="info_content">
							<div class="title3"><img src="img/index/信息.jpg" />景点资讯 <a href="scenicInfo.php">更多>></a></div>
							<div>
								<ul>
									<p style="text-align:center; font-size:18px;" class="tip"><span>内容正在加载中...</span><img src="img/loading.gif" style="width:80px;" /></p>		
								</ul>
							</div>
						</div>

						<!-- 旅游信息 -->
						<div class="info_content info_content2">
							<div class="title3"><img src="img/index/信息.jpg" />旅游信息 <a href="travelInfo.php">更多>></a></div>
							<div>
								<ul>
									<p style="text-align:center; font-size:18px;" class="tip"><span>内容正在加载中...</span><img src="img/loading.gif" style="width:80px;" /></p>
								</ul>
							</div>
						</div>
					</div>
				</div>
				<?php
					include 'inc/sidebar_inc.php';
				?>
			</div>
			<!-- 友情链接 -->
			<div class="friendly">
				<div class="silde">友<br />情<br />链<br />接</div>
				<ul>
				<p style="text-align:center; font-size:18px;" class="tip"><span>内容正在加载中...</span><img src="img/loading.gif" style="width:80px;" /></p>
				</ul>
			</div>
		</div>
		<?php
			include 'inc/footer_inc.php';
		?>

	<script type="text/javascript">
		$(function(){

			nav();		
			
			var oPic=document.getElementById('pic');
			var oUl=document.getElementById('ul1');
			var oUl2=document.getElementsByClassName('tourism')[1].getElementsByTagName('ul')[1];
			var oUl3=document.getElementsByClassName('tourism')[0].getElementsByTagName('ul')[1];
			var info_Ul=document.getElementsByClassName('info_content')[0].getElementsByTagName('ul')[0];
			var info_Ul2=document.getElementsByClassName('info_content2')[0].getElementsByTagName('ul')[0];


			//季节分类
			$.ajax({
				type:"post",
				url:"inc/infodata_inc.php?weather=1",
				async:true,
				success : function (data){
					if(data){
						var json=eval("("+data+")");
						for(var i=0; i<json.length; i++){
							oPic.innerHTML+=json[i].content;
						}
						$('.tip').eq(0).css('display' , 'none');
					}
				}
			});

			//旅游精选
			$.ajax({
				type:"post",
				url:"inc/infodata_inc.php?tours=3",
				async:true,
				success : function (data){
					if(data){
						var json=eval("("+data+")");
						for(var i=0; i<json.length; i++){
							oUl3.innerHTML+='<li class="pics_box"><img src="'+ json[i].url_link +'" alt="'+json[i].title+'" /> <a href="msg_product.php?msg=famousScenery&id='+ json[i].id +'" class="mark">'+ json[i].title +'</a></li>'
						}
						$('.tip').eq(1).css('display' , 'none');
						mark('tour');
					}
				}
			});

			//风景名胜
			$.ajax({
				type:"post",
				url:"inc/infodata_inc.php?tours=2",
				async:true,
				success : function (data){
					if(data){
						var json=eval("("+data+")");
						for(var i=0; i<json.length; i++){
							oUl2.innerHTML += '<li class="pics_box"><img src="'+ json[i].url_link +'" alt="'+json[i].title+'" /> <a href="msg_product.php?msg=famousScenery&id='+ json[i].id +'" class="mark">'+ json[i].title +'</a></li>';
						}
						$('.tip').eq(2).css('display' , 'none');
						mark('tour');	
					}
				}
			});

			//热门景点
			$.ajax({
				type:"post",
				url:"inc/infodata_inc.php?tours=1",
				async:true,
				success : function (data){
					if(data){
						var json=eval("("+data+")");
						for(var i=0; i<json.length; i++){
							oUl.innerHTML+='<li><img src="'+ json[i].url_link +'" class="pic" alt="'+json[i].title+'" /> <a href="msg_product.php?msg=hotSpots&id='+ json[i].id +'" class="mark" title="'+ json[i].title +'">'+ json[i].title +'</a></li>';
						}
						$('.tip').eq(3).css('display' , 'none');
						mark('tour');
					}
						
				}
			});

			//景点资讯
			$.ajax({
				type:"post",
				url:"inc/infodata_inc.php?info2=1",
				async:true,
				success : function (data){
					if(data){
						var json=eval("("+data+")");
						for(var i=0; i<json.length; i++){
							info_Ul.innerHTML+='<li><a href="msg_article.php?msg=scenicinfo&id='+ json[i].id +'" title="'+ json[i].title +'">'+ json[i].title +'</a></li>';
						}	
						$('.tip').eq(4).css('display' , 'none');
					}
				}
			});

			//旅游信息
			$.ajax({
				type:"post",
				url:"inc/infodata_inc.php?info2=2",
				async:true,
				success : function (data){
					if(data){
						var json=eval("("+data+")");
						for(var i=0; i<json.length; i++){
							info_Ul2.innerHTML+='<li><a href="msg_article.php?msg=travelInfo&id='+ json[i].id +'" title="'+ json[i].title +'">'+ json[i].title +'</a></li>';
						}
						$('.tip').eq(5).css('display' , 'none');
					}
				}
			});

		});

	
		//季节分类部分
		var oWeather=document.getElementById('weather');
		var aBnt=oWeather.getElementsByClassName('dot')[0].getElementsByTagName('a');
		var	oPic=document.getElementById('pic');
		var aPic=oWeather.getElementsByClassName('weth_pic');
		var aImg=oPic.getElementsByTagName('img');
		var aSpan=document.getElementsByClassName('txt')[0].getElementsByTagName('span');
		var i=0;
		var iNow=0;

		for(i=0; i<aBnt.length; i++){
			aBnt[i].index=i;
			aBnt[i].onclick=function(){

				if(iNow==this.index){
					return;
				}

				for(i=0; i<aBnt.length; i++){
					aBnt[i].className="";
					aPic[i].style.display="none";
					aSpan[i].className='';
				}
				aBnt[this.index].className="active";
				aPic[this.index].style.display="block";
				aSpan[this.index].className='active';

				for(var j=0; j<aImg.length; j++){
					aImg[j].index=j;
					aImg[j].style.filter="alpha(opacity:0)";
					aImg[j].style.opacity="0";
					startMove(aImg[aImg[j].index],{opacity:100});
				}
					iNow=this.index;
			}
		}
	</script>